<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <title>交易大厅</title>
    <!-- CSS -->
    <link rel="stylesheet" href="{url:#css/materialize.min.css}"/>
    <link rel="stylesheet" href="{url:#css/me.css}"/>
    <link rel="stylesheet" href="{url:#css/iconfont.css}"/>
    <style type="text/css">
        .data-list {
            position: relative;
            overflow: hidden;
            background-color: #ffffff;
        }

        .data-list .item {
            box-sizing: content-box;
            position: relative;
            border-bottom: #eeeeee solid 1px;
            padding: 10px 0px;
        }

        .data-list .item .intro {
            color: #666666;
            font-size: 12px;
        }

        .data-list .item .intro span {
            color: #222222;
            font-size: 12px;
            margin-left: 10px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .data-list .item .num {
            margin-top: 5px;
            color: #666666;
            font-size: 12px;
        }

        .data-list .item .num span {
            color: red;
            font-size: 12px;
            margin-left: 10px;
        }

        .data-list .item .num i {
            font-size: 12px;
            margin-left: 10px;
            text-decoration: none;
            font-style: normal;
        }

        .data-list .btn-buy {
            right: 0px;
            top: 10px;
            bottom: 10px;
            vertical-align: middle;
            position: absolute;
            border: none;
            text-align: center;
            box-sizing: border-box;
            padding: 0px 15px;
        }

    </style>
    <!-- JS -->
    <script src="{url:#js/jquery-1.11.3.min.js}"></script>
    <script src="{url:#js/materialize.min.js}"></script>
    <script src="{url:#js/home/register.js}"></script>
    <script src="{url:#js/yang_check.js}"></script>
</head>
<body class="q-body">
<!-- TitleBar 开始 -->
<div class="navbar-fixed">
    <nav>
        <div class="nav-wrapper red accent-4 valign-wrapper">
            <ul class="left" id="nav-btn-left">
                <li><a><i class="iconfont">&#xe63c;</i></a></li>
            </ul>
            <span class="title-bar-size center_align">交易大厅</span>
            <ul class="right">
                <li><a href="javascript:;"><i class="iconfont">&#xe626;</i></a></li>
            </ul>
        </div>
    </nav>
</div>
<!-- TitleBar 结束 -->

<div class="container">
    <button class="waves-effect waves-light btn z-depth-0 modal-trigger red red red darken-1"
            href="#sale-modal"
            style="margin-top: 20px;width: 100%;margin-bottom: 10px;">
        我要卖出
    </button>
    <div class="data-list">
    
    	{query:name=transaction_sell as t fields=t.*,u.name as uname join=inner join user as u where t.user_id eq u.id order=t.id desc page=1 id=$withdraw}
    		<div class="item">
    		{if:$item['last_quantity']<=0}
    			<button class="btn-buy waves-effect waves-light" style="background-color:#b51c1c;border-color:#b51c1c;">已抢完</button>
    		{else:}
            <button href="#buy-modal" sell_id="{$item['id']}" style="background-color:#12ce35;border-color:#12ce35;" class="btn-buy modal-trigger waves-effect waves-light" onclick="buy(this)">购买</button>
            {/if}
            <div style="height: 100%;display: inline-block;">
                <div class="intro">说明 : <span>{$item['desc']}</span></div>
                <div class="num">
                                    数量 : <span>{$item['last_quantity']}积分 = ¥{echo:$item['last_quantity']*$item['price']}</span><i>(1积分/¥{$item['price']})</i>
                </div>
            </div>
            <div class="clearfix"></div>
        </div>
    	{/query}
    
    	<!-- 
        <div class="item">
            <button href="#buy-modal" buyId="123" class="btn-buy modal-trigger waves-effect waves-light">购买</button>
            <div style="height: 100%;display: inline-block;">
                <div class="intro">说明 : <span>出售复投</span></div>
                <div class="num">
                    数量 : <span>100积分 = ¥10.23</span><i>(1积分/¥1.02)</i>
                </div>
            </div>
            <div class="clearfix"></div>
        </div>
        <div class="item">
            <button href="#buy-modal" buyId="123" class="btn-buy modal-trigger waves-effect waves-light">购买</button>
            <div style="height: 100%;display: inline-block;">
                <div class="intro">说明 : <span>出售复投</span></div>
                <div class="num">
                    数量 : <span>100积分 = ¥10.23</span><i>(1积分/¥1.02)</i>
                </div>
            </div>
            <div class="clearfix"></div>
        </div>
        <div class="item">
            <button href="#buy-modal" buyId="123" class="btn-buy modal-trigger waves-effect waves-light">购买</button>
            <div style="height: 100%;display: inline-block;">
                <div class="intro">说明 : <span>出售复投</span></div>
                <div class="num">
                    数量 : <span>100积分 = ¥10.23</span><i>(1积分/¥1.02)</i>
                </div>
            </div>
            <div class="clearfix"></div>
        </div>
        -->
    </div>

</div>

<!-- 买入对话框 -->
<div id="buy-modal" class="modal bottom-sheet">
	<!-- 
    <form method="post" action="#">
    -->
        <div class="modal-content">
            <div class="row">
                <div class="chip">账户余额：{$mobile_user['balance']}</div>
                <!-- 
                <div class="chip">持仓：10086</div>
                -->
            </div>
            <input id="buy-id" name="buy-id" type="hidden" value="1"/>
            <div class="row">
                <div class="input-field col s12">
                    <input id="buy_quantity" name="buy_quantity" type="text">
                    <label for="buy-num">买入数量</label>
                </div>
            </div>
            <div class="row">
                <div class="input-field col s12">
                    <input name="buy_pass2" id="buy_pass2" type="password">
                    <label for="safepass">交易密码</label>
                </div>
            </div>
        </div>
        <div class="modal-footer">
        	<input type="hidden" id="hid_sell_id"/>
            <a class=" modal-action waves-effect waves-green btn-flat" id="btn_sure_buy" onclick="sure_buy()">确定购买</a>
            <a class=" modal-action modal-close waves-effect waves-green btn-flat">取消</a>
        </div>
        <!-- 
    </form>
    -->
</div>


<!-- 卖出对话框 -->
<div id="sale-modal" class="modal bottom-sheet">
    <form method="post" action="#">
        <div class="modal-content">
            <div class="row">
                <div class="chip">可用积分：{$currency_symbol}{$user['ok_xfjf']}</div>
                <!-- 
                <div class="chip">持仓：10086</div>
                -->
            </div>
            <div class="row">
                <div class="input-field col s12">
                    <input name="quantity" id="quantity" type="text">
                    <label for="sale-num">卖出数量大于等于100且为100的倍数</label>
                </div>
            </div>
            <div class="row">
                <div class="input-field col s12">
                	
                    <input name="price" id="price" type="text">
                    {set:$ok_xfjf_price1=Common::getConfigJjsetValue('jjset_ok_xfjf_price1')}
					{set:$ok_xfjf_price2=Common::getConfigJjsetValue('jjset_ok_xfjf_price2')}
                    <label for="sale-price">卖出单价范围 {$ok_xfjf_price1} - {$ok_xfjf_price2}</label>
                </div>
            </div>
            <div class="row">
                <div class="input-field col s12">
                    <input name="pass2" id="pass2" type="password">
                    <label for="safepass2">交易密码</label>
                </div>
            </div>
        </div>
        <div class="modal-footer">
            <a class="modal-action waves-effect waves-green btn-flat" id="btn_sure_sell" onclick="sure_sell()">确定卖出</a>
            <a class="modal-action modal-close waves-effect waves-green btn-flat">取消</a>
        </div>
    </form>
</div>

<script type="text/javascript">
    $(function () {
        $('.modal-trigger').leanModal();

        $('.btn-buy').bind('click', function () {
            $("#buy-id").val($(this).attr("buyId"));
        });
    });
    
    function buy(obj)
    {
    	$("#hid_sell_id").val($(obj).attr('sell_id'));
    }
    function sure_buy()
    {
    	var sell_id      = $("#hid_sell_id").val();
    	var buy_quantity = $.trim($("#buy_quantity").val());
    	var buy_pass2    = $.trim($("#buy_pass2").val());
    	if(isNaN(buy_quantity) || buy_quantity <= 0)
    	{
    		yang_alert("买入数量至少为1");
    		return;
    	}
    	if(buy_pass2 == '')
    	{
    		yang_alert('交易密码不能为空');
    		return;
    	}
    	
    	$("#btn_sure_buy").attr("disabled", true);
    	$.get("{url:/mobile/buy_ok_xfjf}",{sell_id:sell_id,quantity:buy_quantity,pass2:buy_pass2},function(data){
			if(data['status']=='success'){
				yang_alert("操作成功");
        		document.location.href = document.location.href;
			}else{
				yang_alert(data['msg']);
				$("#btn_sure_buy").attr("disabled", false);
			}
		},'json');
    	
    }
    
    function sure_sell()
    {
    	var quantity = $.trim($("#quantity").val());
    	var price    = $.trim($("#price").val());
    	
    	var pass2    = $.trim($("#pass2").val());
    	
    	if(isNaN(quantity) || quantity < 100 || quantity % 100 != 0 )
    	{
    		yang_alert('卖出数量必须大于等于100且为100的倍数');
    		return;
    	}
    	
    	{set:$ok_xfjf_price1=Common::getConfigJjsetValue('jjset_ok_xfjf_price1')}
		{set:$ok_xfjf_price2=Common::getConfigJjsetValue('jjset_ok_xfjf_price2')}
		var price1 = parseFloat("{$ok_xfjf_price1}");
		var price2 = parseFloat("{$ok_xfjf_price2}");
		
		if(price == "" || price < price1 || price > price2)
		{
			yang_alert("卖出单价范围是{$ok_xfjf_price1} - {$ok_xfjf_price2}");
    		return;
		}
		if(pass2 == '')
		{
			yang_alert('交易密码不能为空');
			return;
		}
		
		$("#btn_sure_sell").attr("disabled", true);
		$.get("{url:/mobile/sell_ok_xfjf}",{quantity:quantity,price:price,pass2:pass2},function(data){
			if(data['status']=='success'){
				yang_alert(data['msg']);
				document.location.href = document.location.href;
			}else{
				yang_alert(data['msg']);
				$("#btn_sure_sell").attr("disabled", false);
			}
		},'json');
		
    }
</script>
</body>
</html>
